<template>
    <el-drawer
        v-model="isShow"
        :title="tittle"
        :destroy-on-close="true"
        size="50%"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
        :show-close="false"
    >
        <el-form :model="form"  ref="formRef" :rules="rules">
            <el-row class="mb-3" :gutter="20">
                <el-col :span="9">
                    <el-form-item label="日报日期" label-width="80px">
                        <el-date-picker
                            v-model="form.adddate"
                            type="date"
                            placeholder="请选择日报日期"
                            value-format="YYYY-MM-DD HH:mm:ss"
                            format="YYYY-MM-DD"
                            style="width:100%"
                            :readonly="isDisabled"
                        />
                    </el-form-item>
                </el-col>
                <el-col :span="3"><el-button v-if="isShowAuto"
                        type="primary"
                        @click="autoGun"
                    >
                        自动生成
                    </el-button></el-col>
                <el-col :span="12" style="text-align: right;">
                    <el-form-item label-width="0px">
                        <el-col :span="24" style="display: flex;display:-webkit-flex;align-items: center;justify-content: end;;width:100%">
                            <el-input-number :controls="false" :max="9999" style="width: 60px" v-model="form.reportyear" :readonly="isDisabled" />
                            <span style="margin: 0 10px;">年</span>
                            <el-input-number :controls="false" :max="99" style="width: 40px" v-model="form.reportnum" :readonly="isDisabled" />
                            <span style="margin: 0 10px;">期/总共</span>
                            <el-input-number :controls="false" :max="999" style="width: 40px" v-model="form.reportallnum" :readonly="isDisabled" />
                            <span style="margin: 0 10px;">期</span>
                        </el-col>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row class="mb-3" :gutter="20">
                <el-col :span="12">
                    <el-form-item label="基本信息" label-position="top">
                        <el-input type="textarea" v-model="form.basicinfo" :rows="8" resize="none" :readonly="isDisabled"
                             />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="规范办案和执勤网上巡查情况" label-position="top">
                        <el-input type="textarea" v-model="form.xcinfo" :rows="8" resize="none" :readonly="isDisabled"
                             />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="平台操作使用情况" label-position="top">
                        <el-input type="textarea" v-model="form.operationinfo" :rows="8" resize="none" :readonly="isDisabled"
                             />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="视频监控排查情况情况" label-position="top">
                        <el-input type="textarea" v-model="form.videoinfo" :rows="8" resize="none" :readonly="isDisabled"
                             />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <template #footer>
            <el-button type="primary" @click="submitHandle()" v-show="isShowTijiaoBtn">提交</el-button>
            <el-button @click="closedrawer()">关闭</el-button>
        </template>
    </el-drawer>
</template>

<script setup>
import { getCurrentInstance } from "vue";
const {proxy} = getCurrentInstance()

import {DAILYInfo,DAILYadd,DAILYedit,DAILYautoGen} from "@/api/monitors/DailyReportManage.js";

const isShow = ref(false)
const tittle = ref('')
const form = ref({
    adddate: '',     // 用来存储日报日期
    reportyear: '',   // 用来存储年份
})


const isShowAuto = ref(true)
const isShowTijiaoBtn = ref(true)
const isDisabled = ref(false)

const rules = {
    fromUnitId: [{ required: true, message: "报-内容不能为空", trigger: "blur" }],
}
// 通知事件
const emit = defineEmits(['getDailyList'])
// 变更显示状态
const changeShowStatus = () => {
    isShow.value = !isShow.value
}
onMounted(() => {
    newdata()
})
// 新增
const newdata = async (tittleV) => {
    const today = new Date();  
    // 如果 adddate 为空，设置为今天的日期
    if (!form.value.adddate) {
        form.value.adddate = today.toISOString().split('T')[0]; // 默认日期为今天
        form.value.adddate = form.value.adddate + ' ' + '00:00:00'
    }
    // 如果 reportyear 为空，设置为当前年份
    if (!form.value.reportyear) {
        form.value.reportyear = today.getFullYear();  // 默认年份为当前年份
    }
}
// 新增
const showAdd = async (tittleV) => {
    tittle.value = tittleV
    isShowAuto.value = true
    isShowTijiaoBtn.value = true
    isDisabled.value = false
    newdata()
    changeShowStatus()
}

// 展示抽屉详情
const showDetail = async (data,tittleV,typeV) => {
    tittle.value = tittleV
    newdata()
    changeShowStatus()
    if(typeV == 'Edit'){
        isShowAuto.value = true
        isShowTijiaoBtn.value = true
        isDisabled.value = false
    }
    if(typeV == 'See'){
        isShowAuto.value = false
        isShowTijiaoBtn.value = false 
        isDisabled.value = true
    }
    await getDetail(data.xcDaliyId)
}
// 获取详情
const getDetail = async (id) => {
    const res = await DAILYInfo(id)
    form.value = res.data
}
// 自动生成
const autoGun = async () => {
    const res = await DAILYautoGen(form.value.adddate)
    form.value = {
        ...form.value,
        basicinfo:res.data.one,
        xcinfo:res.data.two,
        operationinfo:res.data.three,
        videoinfo:res.data.four,
    }
}
const submitHandle = () => {
    proxy.$refs["formRef"].validate(valid => {
        if (valid) {
            console.log(form.value)
            if (form.value['xcDaliyId']) {
                DAILYedit(form.value).then(res => {
                    changeShowStatus()
                    emit('getDailyList', '来了老弟')
                })
            } else {
                DAILYadd(form.value).then(res => {
                    changeShowStatus()
                    emit('getDailyList', '来了老弟')
                })
            }
        }

    });
}
const closedrawer = async () => {
    form.value = {
        adddate: '',     // 用来存储日报日期
        reportyear: '',   // 用来存储年份
    }
    changeShowStatus()
    emit('getDailyList', '来了老弟')
}


defineExpose({showAdd,showDetail})




</script>

<style scoped lang="scss">
:deep().el-input-number.is-without-controls .el-input__wrapper{padding-left: 5px;padding-right: 5px;}
</style>